<template>
  <div class="door">
    <div class="login-box">
      <label>名称: </label>
      &nbsp;
      <input type="text" v-model="username" />
      &nbsp;&nbsp;&nbsp;
      <input type="submit" @click="login" value="进入" />
    </div>
  </div>
</template>

<script>
export default {
  name: "Login",
  props: {
    me: {
      type: String,
      default: "",
    },
  },
  methods: {
    login() {
      let name = this.username.toLowerCase();
      switch (name) {
        case 'god':
          alert("请换一个名字");
          return;
        case 'tetris':
          alert("请换一个名字");
          return;
        case 'siusn':
          alert("请换一个名字");
          return;
        default:
          break;

      }
      var data = { username: this.username };
      this.axios
        .post("http://" + window.location.hostname + ":14000/cola/login/", data)
        .then((res) => {
          let result = res.data;
          console.log(result);
          if (result.code == 0) {
            this.$emit("update:me", this.username);
          } else {
            console.log(result.msg);
            alert(result.msg);
          }
        });
    },
  },
};
</script>

<style scoped lang="scss">
.door {
  width: 100%;
  height: 100%;
  text-align: center;
}
.login-box {
  width: 50%;
  height: 5%;
  top: 35%;
  left: 25%;
  text-align: center;
  position: relative;
}
.login-box * {
  height: 100%;
}
</style>
